<template>
  <h2>{{ counter }}</h2>
  <button @click="btnClick">+</button>
</template>

<script>
import { ref, watch, watchEffect } from 'vue';
  export default {
    setup() {
      const counter = ref(0)
      // watch(counter , (newValue,oldValue) => {
      //   console.log(oldValue,newValue)
      // })
      watchEffect(()=> {
        console.log(counter.value)
      })
      return {
        counter,
        btnClick(){
        counter.value++
      }
    }
  }
}
</script>

<style scoped>

</style>